<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
		<input type="text" autocomplete="off">
		<button>猜大小</button>
		
		<script type="text/javascript">
			// 生成一个 范围在1-100 的整数
			var num = Math.floor(Math.random() *100 + 1) 
			var flag = 1; //定义flag作为参考值，用来判断点击的次数  作为参考 点一次+1 >5
			var input = document.querySelector("input")
			var button = document.querySelector("button")
			// 点击按钮之后：先执行猜数字的逻辑---- 参考值+1 --- 判断参考值是否满足结束条件
			button.onclick = function(){
				/* 1、先执行猜数字的逻辑 */
				//获取用户输入的数字（相信自己是善良的）
				var inp = input.value;
				// 简单判断用户是输入的是否为数字 "NaN" === "NaN"
				if(Number(inp)+"" == "NaN"){
					alert("请输入1-100的数字")
				}else{
					if(inp>num){
						alert("猜大了")
					}else if(inp==num){
						button.onclick = null; // 将事件处理函数设置为null，作用是取消处理函数
						alert("猜对了，游戏结束")
					}else{
						alert("猜小了")
					}
				}
				/* 2、 参考值+1*/
				flag++;
				/* 3、 判断参考值是否满足结束条件*/
				if(flag>5){
					button.onclick = null;
					alert("5次未猜中，游戏结束")
				}
			}
		</script>
	</body>
</html>
